
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
    <title>无标题文档</title>
    <link href="../css/style.css" rel="stylesheet" type="text/css"/>
    <script type="text/javascript" src="../js/jquery.js"></script>
    <!--引入Vue组件 -->
    <script type="text/javascript" src="../js/vue.js"></script>
    <!--引入axios(vue的异步交互)组件 -->
    <script type="text/javascript" src="../js/axios.min.js"></script>
    <!-- 导入自定义的js配置文件-->
    <script type="text/javascript" src="../js/my_base_config.js"></script>
</head>

<body>
<div id="app">
<div class="place">
    <span>位置：</span>
    <ul class="placeul">
        <li><a href="#">首页</a></li>
        <li><a href="#">表单</a></li>`
    </ul>
</div>

<div class="formbody">

    <div class="formtitle"><span>添加管理员账号</span></div>
    <form>
        <ul class="forminfo">
            <li><label>账号名</label><input name="username" type="text" class="dfinput" v-model="form.username"/><i></i></li>
            <li><label>姓名</label><input name="name" type="text" class="dfinput" v-model="form.name"/><i></i></li>
            <li><label>性别</label>
                <select name="sex" class="dfinput" v-model="form.sex">
                    <option value="0">保密</option>
                    <option value="1">男</option>
                    <option value="2">女</option>
                </select>
                <i></i>
            </li>
            <li><label>锁定状态</label><cite>
                <input name="unLocked" type="radio" value="true" checked="checked" v-model="form.unLocked"/>未锁定&nbsp;&nbsp;&nbsp;&nbsp
                <input name="unLocked" type="radio" value="false" v-model="form.unLocked"/>锁定</cite>
            </li>
            <li><label>&nbsp;</label><input name="" type="button" class="btn" value="确认保存" @click="submit"/></li>
        </ul>
    </form>
</div>

</div>
<script>
    new Vue({
        el:'#app',
        data:{
            form:{
                username:'',
                name:'',
                sex:0,
                unLocked:true
            }
        },
        methods:{
            submit(){//提交表单
                if (this.form.username==null||this.form.username==''){
                    alert('请输入账户名');
                }else if (this.form.name==null||this.form.name==''){
                    alert('请输入姓名');
                }else if (this.form.sex==null){
                    alert('请输入性名');
                }else {
                    axios
                    .post('/backstage/adminmanage',JSON.stringify(this.form))
                    .then(response=>{
                        const resonseData=response.data;
                        if (resonseData.success){//如果成功
                            location.href='adminadd.html';

                        }else {//如果失败
                            alert(resonseData.msg)
                        }
                    })
                }
            }
        }
    })


</script>
</body>
</html>
